import {html, TemplateResult} from 'lit';
import type {Meta, StoryObj} from '@storybook/web-components';
import "../../../echarts/line/lit-multiple-x-line.ts"
import {MultipleXLineProps} from "../../../echarts/line/lit-multiple-x-line.ts";

const meta: Meta<MultipleXLineProps> = {
    title: 'Echarts/LitMultipleXLine',
    tags: ['autodocs'],
    parameters: {
        docs: {
            description: {
                component: 'tooltip以及其他各类事件暂时无法在storybook中使用，具体请参考echarts的文档',
            },
        }
    },
    render: (args: MultipleXLineProps): TemplateResult => {
        return html`<lit-multiple-x-line 
            .chartId=${args.chartId}
            .width=${args.width}
            .height=${args.height}
            .legend=${args.legend}
            .label=${args.label}
            .colors=${args.colors}
            .xAxisData=${args.xAxisData}
            .seriesData=${args.seriesData}
        />`;
    },
    argTypes: {
        chartId: { control: 'text' },
        width: { control: 'text' },
        height: { control: 'text' },
        legend: { control: 'object' },
        label: { control: 'text' },
        colors: { control: 'object' },
        xAxisData: { control: 'object' },
        seriesData: { control: 'object' },
    },
};

export default meta;
type Story = StoryObj<MultipleXLineProps>;

export const Default: Story = {
    args: {
        chartId: 'multiple-x-line-chart',
        width: '1200px',
        height: '600px',
        legend: ['Precipitation(2015)', 'Precipitation(2016)'],
        label: 'Precipitation',
        colors: ['#5470C6', '#EE6666'],
        xAxisData: [
            ['2015-1', '2015-2', '2015-3', '2015-4', '2015-5', '2015-6', '2015-7', '2015-8', '2015-9', '2015-10', '2015-11', '2015-12'],
            ['2016-1', '2016-2', '2016-3', '2016-4', '2016-5', '2016-6', '2016-7', '2016-8', '2016-9', '2016-10', '2016-11', '2016-12']
        ],
        seriesData: [
            [2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3],
            [3.9, 5.9, 11.1, 18.7, 48.3, 69.2, 231.6, 46.6, 55.4, 18.4, 10.3, 0.7]
        ]
    }
}
